import { FC } from "react";
import { Breadcrumb } from "antd";
import { Link } from "react-router-dom";
import styles from './styles.module.scss'
import { useSelector, useDispatch } from "react-redux";
import { fetchUserInfo } from "../../store/modules/userStore";
import { useEffect } from "react";
const User: FC = () => {

    const dispatch = useDispatch()
    const { userInfo } = useSelector(state => state.userStore)
    useEffect(() => {
        dispatch(fetchUserInfo())
    }, [dispatch]) // 正确添加依赖数组
    return (
        <div className={styles.user}>
            {/* 面包屑 */}
            <div className={styles.bread}>
                <Breadcrumb
                    items={[
                        {
                            title: <Link to={'/home'}>首页</Link>,
                        },
                        {
                            title: <span > 个人中心</span>
                        },

                    ]}
                />
            </div>

            {/* 内容 */}
            <div className={styles.content}>
                <div className={styles.left}>
                    <ul>
                        <span>我的账户</span>
                        <li>个人中心</li>
                        <li>消息通知</li>
                        <li>个人信息</li>
                        <li>安全设置</li>
                        <li>地址管理</li>
                        <li>我的积分</li>
                        <li>我的足迹</li>
                        <li>邀请有礼</li>
                        <li>幸运抽奖</li>
                    </ul>
                    <ul>
                        <span>交易管理</span>
                        <li>我的订单</li>
                        <li>优惠券</li>
                        <li>礼品卡</li>
                        <li>评价晒单</li>
                        <li>售后服务</li>
                    </ul>
                </div>
                <div className={styles.right}>
                    {/* 个人信息 */}
                    <div className={styles.userInfo}>

                    </div>
                    {/* 收藏 */}
                    <div className={styles.collect}>

                    </div>
                    {/* 足迹 */}
                    <div className={styles.foot}>

                    </div>
                </div>
            </div>
        </div>
    )
}
export default User